import './style.css'

const app = document.querySelector('#app') as HTMLDivElement

const ps = app.querySelectorAll<HTMLParagraphElement>('p')

ps.forEach((p) => {
  p.innerHTML = p.innerText
    .split('')
    .map((item) => `<span>${item}</span>`)
    .join('')
})

const spans = document.querySelectorAll<HTMLSpanElement>('span')

spans.forEach((span, index) => {
  span.style.setProperty('--d', index * 0.1 + 's')
})
